<template>
  <div class="container system-login">
    <el-container>
<!--      <el-aside style="width: 40%; background-color: #fff;display: flex;align-items: center">
        <img src="../../../assets/images/3.png" alt="" style=""/>
      </el-aside>-->

      <el-main>
        <p>
          <img  src="../../../assets/images/login/title.png" alt="" />
        </p>
        <div class="flex">
          <el-form :model="baseInfo"  >
            <ul>
              <li>
                <el-form-item  label="考试">
                  <el-input
                    type="text"
                    readOnly
                    v-model="baseInfo.ksmc"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item  label="考点">
                  <el-input
                    type="text"
                    size="small"
                    readOnly
                    v-model="baseInfo.kdmc"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item  label="通道">
                  <el-input
                    type="text"
                    size="small"
                    readOnly
                    v-model="baseInfo.tdmc"
                  />
                </el-form-item>
              </li>

<!--              <li class=" bottom">
                <el-button
                  type="primary"
                  round
                  @click.native.prevent="updateServiceUrl"
                >考点服务器地址</el-button>
              </li>-->
            </ul>
          </el-form>
          <el-form ref="loginForm"   label-width="130px" :model="loginForm" :rules="loginRules">
            <ul>
              <li>
                <el-form-item prop="jkydm"   label="监考员代码">
                  <el-input
                    class="custom-placeholder"
                    type="text"
                    name="lxdh"
                    v-model="loginForm.jkydm"
                    ref="account"
                    tabindex="1"
                    placeholder="规则：考试代码-考点代码-考场代码"
                  >
                    <el-tooltip class="item" slot="append"  effect="dark" content="考试代码-考点代码-考场代码" placement="top-start">
                      <i class="iconfont icon-examination-tishi" ></i>
                    </el-tooltip>
                  </el-input>

                </el-form-item>
              </li>
<!--              <li>
                <el-form-item prop=""   label="">
                  <span style="color: #fc4e4e">监考员账号规则：考试代码-考点代码-考场代码</span>
                </el-form-item>
              </li>-->
              <li>
                <el-form-item prop="jkymm"   label="监考员密码">
                  <el-input
                    class="custom-placeholder"
                    size="small"
                    type="password"
                    name="mm"
                    v-model="loginForm.jkymm"
                    ref="password"
                    tabindex="2"
                    placeholder="请输入监考员密码"
                  />
                </el-form-item>
              </li>
              <li>
                <el-form-item prop="yzm"   label="验证码">
                  <el-input
                    size="small"
                    class="code custom-placeholder"
                    name="yzm"
                    v-model="loginForm.yzm"
                    ref="code"
                    tabindex="2"
                    placeholder="请输入验证码"
                  />
                  <img @click="getVerifyCodeImg()" class="code-img" :src="imgCode"/>
                </el-form-item>
              </li>
              <li class="bottom">
                <el-button
                  :loading="loading"
                  type="primary"
                  round
                  @click.native.prevent="handleLogin"
                >{{ $t("login.logIn") }}</el-button>
              </li>
            </ul>
          </el-form>
        </div>
      </el-main>
    </el-container>
    <ServiceForm v-show="serviceFormVisible"  ref="serviceAdrForm" @close="removeForm" @refreshDataList="initData" />
    <Form v-show="formVisible" ref="Form" @close="removeForm"  @refreshDataList="initData"/>
  </div>
</template>
<script>
export { default } from './index.js'
</script>
<style lang="scss" scoped>
@import url(index.scss);
</style>
